<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<title></title>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<link href="css/mui.min.css" rel="stylesheet" />
		<script src="//g.alicdn.com/dingding/open-develop/1.6.9/dingtalk.js"></script>
		<script src="./js/vue.js"></script>
		<script src="js/common.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="./css/flowChart.css" />
	</head>
	<style type="text/css">
		.flowChart {

			background-color: #efeff4;
		}

		#t {
			margin-top: 45px !important;
		}
	</style>
	<body>
		<!-- mui顶部导航栏 -->
		<header class="mui-bar mui-bar-nav mui-bar-nav-bg">
			<a id="icon-menu" class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<a class="mui-action-back mui-icon mui-icon-home mui-pull-right mui-a-color"></a>
			<h1 class="mui-title">历史</h1>
		</header>

		<!--事件时间轴-->
		<div id="t" class="dv">
			<!-- 将后台数据渲染到页面 -->
			<div class="flowChart"  v-for="itam in arry">
				<!--左侧轴-->
				<div class="flowChart-left">
					<!--虚线-->
					<div class="dashed"></div>
				</div>
				<!--右侧内容-->
				<div class="flowChart-right">
					<!--一个节点-->
					<div class="oneNode">
						<!--左侧小球-->
						<div class="check check-danger">

						</div>
						<div class="tag-boder">
							<div class="tag">
							</div>
						</div>

						<!--右侧内容-->
						<div class="NodeDetail">
							<!--上-->
							<div class="NodeDetail-title">
								<!--头像-->

								<!--内容-->
								<div class="details">
									<h4>{{itam.userName }}</h4>
									<p></p>
								</div>
							</div>
							<!--中-->
							<div class="NodeDetail-content"> 


								<p style="color:rgb(72, 108, 160); font-weight: 700 ;">测量地点：<span>{{itam.surveyorsPlace}}</span></p>
								<p style="color:rgb(72, 108, 160); font-weight: 700 ;">测量人：<span>{{itam.surveyorsUserIdName}}</span></p>
								<p style="color:rgb(72, 108, 160); font-weight: 700 ;">被测量人：<span>{{itam.userName}}</span></p>
								<p style="color:rgb(72, 108, 160); font-weight: 700 ;">测量时间：<span>{{itam.createTime}}</span></p>
							</div>
							<!--下-->
							<div class="NodeDetail-footer">
								<span></span>

							</div>
						</div>
					</div>




				</div>






			</div>
		</div>
	</body>
	<script src="js/mui.js"></script>
		
	<script type="text/javascript">
		$(function() {
			var id;
			var vm = new Vue({
				el:".dv",
				data() {
					return {
						arry: []
					}
				},
			});

			
		
			dd.ready(function() {
				dd.runtime.permission.requestAuthCode({
					corpId: 'dingdd68e5ace8321d7a35c2f4657eb6378f', // 企业id
					onSuccess: function(info) {
						// 通过该免登授权码可以获取用户身份
						var jsond = new Object();
						jsond.authCode = info.code;
						
						$.ajax({
							url: route+'login',
							//将获取到的code传到后台
							data: JSON.stringify(jsond),
							async: false,
							headers: {
								"Content-Type": "application/json;charset=UTF-8"
							},
							dataType: 'json', //服务器返回json格式数据
							type: 'post', //HTTP请求类型
							success: function(data) {
	
								var parJson=new Object();
							    parJson.userId=data.userId;
								
								$.ajax({
									url: route+'investigation/findDataByUserId',
									//将获取到的userId传到后台
									data: JSON.stringify(parJson),
									headers: {
										"Content-Type": "application/json;charset=UTF-8"
									},
									
									dataType: 'json', //服务器返回json格式数据
									type: 'post', //HTTP请求类型
									success: function(data) {
										//将数据传入vue变量
										vm.arry=data.data;
									},
									error: function(XMLHttpRequest, textStatus, errorThrown) {
										//alert(textStatus); 
									}
								});
	
							},
							error: function(XMLHttpRequest, textStatus, errorThrown) {
								//alert(textStatus); 
							}
						});
					},
					onFail: function(err) {
						//alert(JSON.stringify(data));
					},
	
				});
	
			});
		})
	</script>

</html>
